<!--
  * 官方 二维码
  * 
  * @Author:    1024创新实验室-主任：卓大 
  * @Date:      2022-09-12 22:34:00 
  * @Wechat:    zhuda1024 
  * @Email:     lab1024@163.com 
  * @Copyright  1024创新实验室 （ https://1024lab.net ），Since 2012 
  *
-->
<template>
  <default-home-card icon="SmileOutlined" title="基本数据">


      <a-row direction="vertical" justify="center"  >
        <a-card hoverable style="width:80%;margin-bottom: 20px">
          <a-card-meta title="用户数量">
            <template #avatar>
              <UserOutlined />
            </template>
          </a-card-meta>
          <a-statistic :value="data.form.userNum" />
        </a-card>
        <a-card hoverable style="width:80%;margin-bottom: 20px">
          <a-card-meta title="课程数量">
            <template #avatar>
              <CopyOutlined />
            </template>
          </a-card-meta>
          <a-statistic :value="data.form.courseNum" />
        </a-card>
        <a-card hoverable style="width:80%;margin-bottom: 20px">
          <a-card-meta title="试题数量">
            <template #avatar>
              <FormOutlined />
            </template>
          </a-card-meta>
          <a-statistic :value="data.form.questionNum" />
        </a-card>
        <a-card hoverable style="width:80%;margin-bottom: 20px">
          <a-card-meta title="试卷数量">
            <template #avatar>
              <HighlightOutlined />
            </template>
          </a-card-meta>
          <a-statistic :value="data.form.paperNum" />
        </a-card>
        <a-card hoverable style="width:80%;margin-bottom: 20px">
          <a-card-meta title="考试数量">
            <template #avatar>
              <DiffOutlined />
            </template>
          </a-card-meta>
          <a-statistic :value="data.form.examNum" />
        </a-card>
      </a-row>

  </default-home-card>
</template>
<script setup>
  import DefaultHomeCard from '/@/views/system/home/components/default-home-card.vue';
  import { basecountApi } from '/@/api/business/exam/basecount-api.js';
  import { onMounted, reactive } from 'vue';

  const data = reactive({
    form: {
      userNum: 0,
      courseNum: 0,
      questionNum: 0,
      paperNum: 0,
      examNum: 0,
    },
  });
  onMounted(() => {
    basecountApi
      .basecount()
      .then((res) => {
        data.form = res.data;
      })
      .catch((err) => {
        console.log(err);
      });
  });
</script>
<style lang="less" scoped></style>
